<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>990px grid system | 33 columns ~ margin left: 5px ~ margin right: 5px &mdash; based on 960.gs</title>
<meta name="keywords" content="990px grid system, grid system generator, variable grid system, custom grid system, css framework, generator, xhtml, css, grid system generator, 960 grid generator, 960 grid system generator, web development workflow, web development cycle"/>
<meta name="description" content="The 990px grid system | 33 columns ~ margin left: 5px ~ margin right: 5px &mdash; is a valid css / xhtml framework for rapid prototyping, development and production environments (based on the 960.gs grid system)."/>
<meta name="generator" content="GridSystemGenerator.com - v1.04"/>
<link rel="stylesheet" type="text/css" media="all" href="css/reset.css"/>
<link rel="stylesheet" type="text/css" media="all" href="css/text.css"/>
<link rel="stylesheet" type="text/css" media="all" href="css/990_33_5_5.css"/>
<style type="text/css" media="all">
body {
	background: #efefef;
	color: #333;
	font-size: 11px;
	padding: 20px 0 40px;
}
a {
	color: #333;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
.container_33 h1 {
	font-family: Georgia, serif;
	font-weight: normal;
	text-align: center;
}
.container_33 h2 {
	padding: 20px 0 0;
	font-family: Georgia, serif;
	font-weight: normal;
	text-align: center;
}
.container_33 p {
	border: 1px solid #666;
	overflow: hidden;
	padding: 10px 0;
	text-align: center;
	font-size: 80%;
}
.container_33 {
	background-color:#FFFFFF;
	background-image: url(images/990_33_5_5.png);
	background-repeat: repeat-y;
}
</style>
</head>
<body>
<div class="container_33">
<h1><a href="http://www.gridsystemgenerator.com/gs01.php?GridWidth=990&amp;GridColumns=33&amp;GridMarginLeft=5&amp;GridMarginRight=5">990px valid css/xhtml 960.gs grid system</a></h1>
<h2>33 columns ~ margin left: 5px ~ margin right: 5px</h2>
<div class="grid_33"><p>980px</p></div>
<!-- end .grid_33 -->
<div class="clear">&nbsp;</div>
<div class="grid_1">
<p>20px</p>
</div>
<!-- end .grid_1 -->
<div class="grid_32">
<p>950px</p>
</div>
<!-- end .grid_32 -->
<div class="clear">&nbsp;</div>
<div class="grid_2">
<p>50px</p>
</div>
<!-- end .grid_2 -->
<div class="grid_31">
<p>920px</p>
</div>
<!-- end .grid_31 -->
<div class="clear">&nbsp;</div>
<div class="grid_3">
<p>80px</p>
</div>
<!-- end .grid_3 -->
<div class="grid_30">
<p>890px</p>
</div>
<!-- end .grid_30 -->
<div class="clear">&nbsp;</div>
<div class="grid_4">
<p>110px</p>
</div>
<!-- end .grid_4 -->
<div class="grid_29">
<p>860px</p>
</div>
<!-- end .grid_29 -->
<div class="clear">&nbsp;</div>
<div class="grid_5">
<p>140px</p>
</div>
<!-- end .grid_5 -->
<div class="grid_28">
<p>830px</p>
</div>
<!-- end .grid_28 -->
<div class="clear">&nbsp;</div>
<div class="grid_6">
<p>170px</p>
</div>
<!-- end .grid_6 -->
<div class="grid_27">
<p>800px</p>
</div>
<!-- end .grid_27 -->
<div class="clear">&nbsp;</div>
<div class="grid_7">
<p>200px</p>
</div>
<!-- end .grid_7 -->
<div class="grid_26">
<p>770px</p>
</div>
<!-- end .grid_26 -->
<div class="clear">&nbsp;</div>
<div class="grid_8">
<p>230px</p>
</div>
<!-- end .grid_8 -->
<div class="grid_25">
<p>740px</p>
</div>
<!-- end .grid_25 -->
<div class="clear">&nbsp;</div>
<div class="grid_9">
<p>260px</p>
</div>
<!-- end .grid_9 -->
<div class="grid_24">
<p>710px</p>
</div>
<!-- end .grid_24 -->
<div class="clear">&nbsp;</div>
<div class="grid_10">
<p>290px</p>
</div>
<!-- end .grid_10 -->
<div class="grid_23">
<p>680px</p>
</div>
<!-- end .grid_23 -->
<div class="clear">&nbsp;</div>
<div class="grid_11">
<p>320px</p>
</div>
<!-- end .grid_11 -->
<div class="grid_22">
<p>650px</p>
</div>
<!-- end .grid_22 -->
<div class="clear">&nbsp;</div>
<div class="grid_12">
<p>350px</p>
</div>
<!-- end .grid_12 -->
<div class="grid_21">
<p>620px</p>
</div>
<!-- end .grid_21 -->
<div class="clear">&nbsp;</div>
<div class="grid_13">
<p>380px</p>
</div>
<!-- end .grid_13 -->
<div class="grid_20">
<p>590px</p>
</div>
<!-- end .grid_20 -->
<div class="clear">&nbsp;</div>
<div class="grid_14">
<p>410px</p>
</div>
<!-- end .grid_14 -->
<div class="grid_19">
<p>560px</p>
</div>
<!-- end .grid_19 -->
<div class="clear">&nbsp;</div>
<div class="grid_15">
<p>440px</p>
</div>
<!-- end .grid_15 -->
<div class="grid_18">
<p>530px</p>
</div>
<!-- end .grid_18 -->
<div class="clear">&nbsp;</div>
<div class="grid_16">
<p>470px</p>
</div>
<!-- end .grid_16 -->
<div class="grid_17">
<p>500px</p>
</div>
<!-- end .grid_17 -->
<div class="clear">&nbsp;</div>
<div class="grid_17">
<p>500px</p>
</div>
<!-- end .grid_17 -->
<div class="grid_16">
<p>470px</p>
</div>
<!-- end .grid_16 -->
<div class="clear">&nbsp;</div>
<div class="grid_18">
<p>530px</p>
</div>
<!-- end .grid_18 -->
<div class="grid_15">
<p>440px</p>
</div>
<!-- end .grid_15 -->
<div class="clear">&nbsp;</div>
<div class="grid_19">
<p>560px</p>
</div>
<!-- end .grid_19 -->
<div class="grid_14">
<p>410px</p>
</div>
<!-- end .grid_14 -->
<div class="clear">&nbsp;</div>
<div class="grid_20">
<p>590px</p>
</div>
<!-- end .grid_20 -->
<div class="grid_13">
<p>380px</p>
</div>
<!-- end .grid_13 -->
<div class="clear">&nbsp;</div>
<div class="grid_21">
<p>620px</p>
</div>
<!-- end .grid_21 -->
<div class="grid_12">
<p>350px</p>
</div>
<!-- end .grid_12 -->
<div class="clear">&nbsp;</div>
<div class="grid_22">
<p>650px</p>
</div>
<!-- end .grid_22 -->
<div class="grid_11">
<p>320px</p>
</div>
<!-- end .grid_11 -->
<div class="clear">&nbsp;</div>
<div class="grid_23">
<p>680px</p>
</div>
<!-- end .grid_23 -->
<div class="grid_10">
<p>290px</p>
</div>
<!-- end .grid_10 -->
<div class="clear">&nbsp;</div>
<div class="grid_24">
<p>710px</p>
</div>
<!-- end .grid_24 -->
<div class="grid_9">
<p>260px</p>
</div>
<!-- end .grid_9 -->
<div class="clear">&nbsp;</div>
<div class="grid_25">
<p>740px</p>
</div>
<!-- end .grid_25 -->
<div class="grid_8">
<p>230px</p>
</div>
<!-- end .grid_8 -->
<div class="clear">&nbsp;</div>
<div class="grid_26">
<p>770px</p>
</div>
<!-- end .grid_26 -->
<div class="grid_7">
<p>200px</p>
</div>
<!-- end .grid_7 -->
<div class="clear">&nbsp;</div>
<div class="grid_27">
<p>800px</p>
</div>
<!-- end .grid_27 -->
<div class="grid_6">
<p>170px</p>
</div>
<!-- end .grid_6 -->
<div class="clear">&nbsp;</div>
<div class="grid_28">
<p>830px</p>
</div>
<!-- end .grid_28 -->
<div class="grid_5">
<p>140px</p>
</div>
<!-- end .grid_5 -->
<div class="clear">&nbsp;</div>
<div class="grid_29">
<p>860px</p>
</div>
<!-- end .grid_29 -->
<div class="grid_4">
<p>110px</p>
</div>
<!-- end .grid_4 -->
<div class="clear">&nbsp;</div>
<div class="grid_30">
<p>890px</p>
</div>
<!-- end .grid_30 -->
<div class="grid_3">
<p>80px</p>
</div>
<!-- end .grid_3 -->
<div class="clear">&nbsp;</div>
<div class="grid_31">
<p>920px</p>
</div>
<!-- end .grid_31 -->
<div class="grid_2">
<p>50px</p>
</div>
<!-- end .grid_2 -->
<div class="clear">&nbsp;</div>
<div class="grid_32">
<p>950px</p>
</div>
<!-- end .grid_32 -->
<div class="grid_1">
<p>20px</p>
</div>
<!-- end .grid_1 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 suffix_32">
<p>20px</p>
</div>
<!-- end .grid_1.suffix_32 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_1 suffix_31">
<p>20px</p>
</div>
<!-- end .grid_1 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_2 suffix_30">
<p>20px</p>
</div>
<!-- end .grid_2 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_3 suffix_29">
<p>20px</p>
</div>
<!-- end .grid_3 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_4 suffix_28">
<p>20px</p>
</div>
<!-- end .grid_4 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_5 suffix_27">
<p>20px</p>
</div>
<!-- end .grid_5 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_6 suffix_26">
<p>20px</p>
</div>
<!-- end .grid_6 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_7 suffix_25">
<p>20px</p>
</div>
<!-- end .grid_7 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_8 suffix_24">
<p>20px</p>
</div>
<!-- end .grid_8 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_9 suffix_23">
<p>20px</p>
</div>
<!-- end .grid_9 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_10 suffix_22">
<p>20px</p>
</div>
<!-- end .grid_10 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_11 suffix_21">
<p>20px</p>
</div>
<!-- end .grid_11 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_12 suffix_20">
<p>20px</p>
</div>
<!-- end .grid_12 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_13 suffix_19">
<p>20px</p>
</div>
<!-- end .grid_13 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_14 suffix_18">
<p>20px</p>
</div>
<!-- end .grid_14 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_15 suffix_17">
<p>20px</p>
</div>
<!-- end .grid_15 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_16 suffix_16">
<p>20px</p>
</div>
<!-- end .grid_16 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_17 suffix_15">
<p>20px</p>
</div>
<!-- end .grid_17 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_18 suffix_14">
<p>20px</p>
</div>
<!-- end .grid_18 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_19 suffix_13">
<p>20px</p>
</div>
<!-- end .grid_19 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_20 suffix_12">
<p>20px</p>
</div>
<!-- end .grid_20 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_21 suffix_11">
<p>20px</p>
</div>
<!-- end .grid_21 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_22 suffix_10">
<p>20px</p>
</div>
<!-- end .grid_22 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_23 suffix_9">
<p>20px</p>
</div>
<!-- end .grid_23 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_24 suffix_8">
<p>20px</p>
</div>
<!-- end .grid_24 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_25 suffix_7">
<p>20px</p>
</div>
<!-- end .grid_25 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_26 suffix_6">
<p>20px</p>
</div>
<!-- end .grid_26 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_27 suffix_5">
<p>20px</p>
</div>
<!-- end .grid_27 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_28 suffix_4">
<p>20px</p>
</div>
<!-- end .grid_28 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_29 suffix_3">
<p>20px</p>
</div>
<!-- end .grid_29 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_30 suffix_2">
<p>20px</p>
</div>
<!-- end .grid_30 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_31 suffix_1">
<p>20px</p>
</div>
<!-- end .grid_31 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 prefix_32 suffix_0">
<p>20px</p>
</div>
<!-- end .grid_32 -->
<div class="clear">&nbsp;</div>
<div class="grid_1 push_32">
<p>Push (20px)</p>
</div>
<!-- end .grid_1 .push_32 -->
<div class="grid_32 pull_1">
<p>Pull (950px)</p>
</div>
<!-- end .grid_32.pull_1 -->
<div class="clear">&nbsp;</div>
<div class="grid_2 push_31">
<p>Push (50px)</p>
</div>
<!-- end .grid_2 .push_31 -->
<div class="grid_31 pull_2">
<p>Pull (920px)</p>
</div>
<!-- end .grid_31.pull_2 -->
<div class="clear">&nbsp;</div>
<div class="grid_3 push_30">
<p>Push (80px)</p>
</div>
<!-- end .grid_3 .push_30 -->
<div class="grid_30 pull_3">
<p>Pull (890px)</p>
</div>
<!-- end .grid_30.pull_3 -->
<div class="clear">&nbsp;</div>
<div class="grid_4 push_29">
<p>Push (110px)</p>
</div>
<!-- end .grid_4 .push_29 -->
<div class="grid_29 pull_4">
<p>Pull (860px)</p>
</div>
<!-- end .grid_29.pull_4 -->
<div class="clear">&nbsp;</div>
<div class="grid_5 push_28">
<p>Push (140px)</p>
</div>
<!-- end .grid_5 .push_28 -->
<div class="grid_28 pull_5">
<p>Pull (830px)</p>
</div>
<!-- end .grid_28.pull_5 -->
<div class="clear">&nbsp;</div>
<div class="grid_6 push_27">
<p>Push (170px)</p>
</div>
<!-- end .grid_6 .push_27 -->
<div class="grid_27 pull_6">
<p>Pull (800px)</p>
</div>
<!-- end .grid_27.pull_6 -->
<div class="clear">&nbsp;</div>
<div class="grid_7 push_26">
<p>Push (200px)</p>
</div>
<!-- end .grid_7 .push_26 -->
<div class="grid_26 pull_7">
<p>Pull (770px)</p>
</div>
<!-- end .grid_26.pull_7 -->
<div class="clear">&nbsp;</div>
<div class="grid_8 push_25">
<p>Push (230px)</p>
</div>
<!-- end .grid_8 .push_25 -->
<div class="grid_25 pull_8">
<p>Pull (740px)</p>
</div>
<!-- end .grid_25.pull_8 -->
<div class="clear">&nbsp;</div>
<div class="grid_9 push_24">
<p>Push (260px)</p>
</div>
<!-- end .grid_9 .push_24 -->
<div class="grid_24 pull_9">
<p>Pull (710px)</p>
</div>
<!-- end .grid_24.pull_9 -->
<div class="clear">&nbsp;</div>
<div class="grid_10 push_23">
<p>Push (290px)</p>
</div>
<!-- end .grid_10 .push_23 -->
<div class="grid_23 pull_10">
<p>Pull (680px)</p>
</div>
<!-- end .grid_23.pull_10 -->
<div class="clear">&nbsp;</div>
<div class="grid_11 push_22">
<p>Push (320px)</p>
</div>
<!-- end .grid_11 .push_22 -->
<div class="grid_22 pull_11">
<p>Pull (650px)</p>
</div>
<!-- end .grid_22.pull_11 -->
<div class="clear">&nbsp;</div>
<div class="grid_12 push_21">
<p>Push (350px)</p>
</div>
<!-- end .grid_12 .push_21 -->
<div class="grid_21 pull_12">
<p>Pull (620px)</p>
</div>
<!-- end .grid_21.pull_12 -->
<div class="clear">&nbsp;</div>
<div class="grid_13 push_20">
<p>Push (380px)</p>
</div>
<!-- end .grid_13 .push_20 -->
<div class="grid_20 pull_13">
<p>Pull (590px)</p>
</div>
<!-- end .grid_20.pull_13 -->
<div class="clear">&nbsp;</div>
<div class="grid_14 push_19">
<p>Push (410px)</p>
</div>
<!-- end .grid_14 .push_19 -->
<div class="grid_19 pull_14">
<p>Pull (560px)</p>
</div>
<!-- end .grid_19.pull_14 -->
<div class="clear">&nbsp;</div>
<div class="grid_15 push_18">
<p>Push (440px)</p>
</div>
<!-- end .grid_15 .push_18 -->
<div class="grid_18 pull_15">
<p>Pull (530px)</p>
</div>
<!-- end .grid_18.pull_15 -->
<div class="clear">&nbsp;</div>
<div class="grid_16 push_17">
<p>Push (470px)</p>
</div>
<!-- end .grid_16 .push_17 -->
<div class="grid_17 pull_16">
<p>Pull (500px)</p>
</div>
<!-- end .grid_17.pull_16 -->
<div class="clear">&nbsp;</div>
<div class="grid_17 push_16">
<p>Push (500px)</p>
</div>
<!-- end .grid_17 .push_16 -->
<div class="grid_16 pull_17">
<p>Pull (470px)</p>
</div>
<!-- end .grid_16.pull_17 -->
<div class="clear">&nbsp;</div>
<div class="grid_18 push_15">
<p>Push (530px)</p>
</div>
<!-- end .grid_18 .push_15 -->
<div class="grid_15 pull_18">
<p>Pull (440px)</p>
</div>
<!-- end .grid_15.pull_18 -->
<div class="clear">&nbsp;</div>
<div class="grid_19 push_14">
<p>Push (560px)</p>
</div>
<!-- end .grid_19 .push_14 -->
<div class="grid_14 pull_19">
<p>Pull (410px)</p>
</div>
<!-- end .grid_14.pull_19 -->
<div class="clear">&nbsp;</div>
<div class="grid_20 push_13">
<p>Push (590px)</p>
</div>
<!-- end .grid_20 .push_13 -->
<div class="grid_13 pull_20">
<p>Pull (380px)</p>
</div>
<!-- end .grid_13.pull_20 -->
<div class="clear">&nbsp;</div>
<div class="grid_21 push_12">
<p>Push (620px)</p>
</div>
<!-- end .grid_21 .push_12 -->
<div class="grid_12 pull_21">
<p>Pull (350px)</p>
</div>
<!-- end .grid_12.pull_21 -->
<div class="clear">&nbsp;</div>
<div class="grid_22 push_11">
<p>Push (650px)</p>
</div>
<!-- end .grid_22 .push_11 -->
<div class="grid_11 pull_22">
<p>Pull (320px)</p>
</div>
<!-- end .grid_11.pull_22 -->
<div class="clear">&nbsp;</div>
<div class="grid_23 push_10">
<p>Push (680px)</p>
</div>
<!-- end .grid_23 .push_10 -->
<div class="grid_10 pull_23">
<p>Pull (290px)</p>
</div>
<!-- end .grid_10.pull_23 -->
<div class="clear">&nbsp;</div>
<div class="grid_24 push_9">
<p>Push (710px)</p>
</div>
<!-- end .grid_24 .push_9 -->
<div class="grid_9 pull_24">
<p>Pull (260px)</p>
</div>
<!-- end .grid_9.pull_24 -->
<div class="clear">&nbsp;</div>
<div class="grid_25 push_8">
<p>Push (740px)</p>
</div>
<!-- end .grid_25 .push_8 -->
<div class="grid_8 pull_25">
<p>Pull (230px)</p>
</div>
<!-- end .grid_8.pull_25 -->
<div class="clear">&nbsp;</div>
<div class="grid_26 push_7">
<p>Push (770px)</p>
</div>
<!-- end .grid_26 .push_7 -->
<div class="grid_7 pull_26">
<p>Pull (200px)</p>
</div>
<!-- end .grid_7.pull_26 -->
<div class="clear">&nbsp;</div>
<div class="grid_27 push_6">
<p>Push (800px)</p>
</div>
<!-- end .grid_27 .push_6 -->
<div class="grid_6 pull_27">
<p>Pull (170px)</p>
</div>
<!-- end .grid_6.pull_27 -->
<div class="clear">&nbsp;</div>
<div class="grid_28 push_5">
<p>Push (830px)</p>
</div>
<!-- end .grid_28 .push_5 -->
<div class="grid_5 pull_28">
<p>Pull (140px)</p>
</div>
<!-- end .grid_5.pull_28 -->
<div class="clear">&nbsp;</div>
<div class="grid_29 push_4">
<p>Push (860px)</p>
</div>
<!-- end .grid_29 .push_4 -->
<div class="grid_4 pull_29">
<p>Pull (110px)</p>
</div>
<!-- end .grid_4.pull_29 -->
<div class="clear">&nbsp;</div>
<div class="grid_30 push_3">
<p>Push (890px)</p>
</div>
<!-- end .grid_30 .push_3 -->
<div class="grid_3 pull_30">
<p>Pull (80px)</p>
</div>
<!-- end .grid_3.pull_30 -->
<div class="clear">&nbsp;</div>
<div class="grid_31 push_2">
<p>Push (920px)</p>
</div>
<!-- end .grid_31 .push_2 -->
<div class="grid_2 pull_31">
<p>Pull (50px)</p>
</div>
<!-- end .grid_2.pull_31 -->
<div class="clear">&nbsp;</div>
<div class="grid_32 push_1">
<p>Push (950px)</p>
</div>
<!-- end .grid_32 .push_1 -->
<div class="grid_1 pull_32">
<p>Pull (20px)</p>
</div>
<!-- end .grid_1.pull_32 -->
<div class="clear">&nbsp;</div>
<div class="grid_33">
<p>This valid css/xhtml grid system is created by the <a href="http://www.gridsystemgenerator.com">Grid System Generator</a><br/>
Based on the 960.gs grid system.<br/>
<a href="http://validator.w3.org/check/referer">XHTML</a> - <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a></p>
</div>
<!-- end .grid_33 -->
<div class="clear">&nbsp;</div>
</div>
<!-- end .container_33 -->
</body></html>